<template>
  <div class="portfolio-position-transfer">
    <div v-if="false">{{testData}}</div>
    <div class="portfolio-common-title">
      <span></span>
      <div>最新调仓</div>
    </div>
    <div class='none-data' v-if="isLoading"><span><i class="iconfont icon-jiazai"></i></span></div>
    <div class='none-data' v-else-if="!isLoading && record.length == 0">{{error}}</div>
    <table v-else>
      <tbody>
      <tr>
        <td>
          <div class="color-red text-md" :class="record[0].entrust_bs == 1?'color-red':'color-blue2'">{{record[0].entrust_bs == 1?"买单":"卖单"}}</div>
        </td>
        <td @click.stop.prevent="toStock">
          <i class="iconfont icon-gu"></i>
          <span class="stock_name">{{record[0].stock_name}}</span>
          <div class="stock_code">{{record[0].market_code}}{{record[0].stock_code}}</div>
        </td>
        <td>
          <div class="last_price" :class="record[0].entrust_bs == 1?'color-red':'color-green'">{{record[0].entrust_price}}</div>
          <div><span :class="record[0].entrust_bs == 1?'color-red2':'color-blue2'">{{record[0].entrust_bs == 1?"买入":"卖出"}}</span><span class="num_buy">{{record[0].entrust_vol}}</span><span>股</span>
          </div>
        </td>
        <td>
          <div>
            <span class="entrust_date">{{record[0].entrust_date}}</span>
            <span>{{record[0].entrust_time}}</span>
          </div>
          <div>
          <span>{{record[0].position_old}}%</span><i
          class="iconfont icon-jiantou"></i><span>{{record[0].position_new}}%</span>
          </div>
        </td>
      </tr>
      <tr>
        <td></td>
        <td colspan="3" class="reasons">
          {{record[0].reason1Obj == null && record[0].reason2Obj == null && record[0].reason3Obj == null?'暂无调仓原因':'调仓原因'}}
          <span id="reason1Text" v-if="record[0].reason1Obj">
              <i class='iconfont' :class="record[0].reason1Obj.reasonIcon"></i>{{record[0].reason1Obj.reasonText}}
          </span>
          <span id="reason2Text" v-if="record[0].reason2Obj">
              <i class='iconfont' :class="record[0].reason2Obj.reasonIcon"></i>{{record[0].reason2Obj.reasonText}}
          </span>
          <span id="reason3Text" v-if="record[0].reason3Obj">
              <i class='iconfont' :class="record[0].reason3Obj.reasonIcon"></i>{{record[0].reason3Obj.reasonText}}
          </span>
        </td>
      </tr>
      <tr>
        <td colspan="4">
          <div class="button" v-if="record[0].entrust_bs == 1" :data-code="record[0].stock_code"
               :data-name="record[0].stock_name" :data-market="record[0].exchange_type"
               :data-entrust="record[0].entrust_bs" @click.stop.prevent="toBuy">
            <i class="iconfont icon-mairu"></i>模拟买入
          </div>
        </td>
      </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
  import CommonUtil from 'common/common.util'
  import Constant from 'common/constant'
  import RemoteDAO from 'common/remoteDAO'
  import LocalDAO from 'common/localDAO'

  export default {
    name: 'PositionTransfer',
    data () {
      return {
        isLoading: true,
        error: '无调仓记录',
        reasonsLabel: '调仓原因',
        reason1Obj: {reasonIcon: '', reasonText: ''},
        reason2Obj: {reasonIcon: '', reasonText: ''},
        reason3Obj: {reasonIcon: '', reasonText: ''},
        testData: 'testData',
        record: [{
          entrust_bs: '',
          stock_name: '',
          stock_code: '',
          market_code: '',
          entrust_price: '0',
          entrust_vol: '0',
          entrust_date: '',
          entrust_time: '',
          position_old: '0',
          position_new: '0'
        }]
      }
    },
    props: {
      userCode: {
        type: String
      },
      clientId: {
        type: String
      },
      groupId: {
        type: String
      }
    },
    created: function () {
      this.fetchData()
    },
    watch: {
      '$route.query.groupId' (to, from) {
        //跳转相同页面，组件不重新构建，无法调用created,故需监听
        this.fetchData()
      }
    },
    methods: {
      fetchData(){
        var self = this;
        self.isLoading = true;
        //调仓查询
        RemoteDAO.callJCL11142(self.clientId, self.groupId, function (response) {
          if (Number(response.error) === 0) {
            var record = response.data.body.record;
            if (record.length > 0) {
              record[0].market_code = CommonUtil.getMarketCode(record[0].exchange_type);
              record[0].entrust_price = CommonUtil.toFixed(record[0].entrust_price, 2);
              record[0].position_new = CommonUtil.toFixed(record[0].position_new, 2);
              record[0].position_old = CommonUtil.toFixed(record[0].position_old, 2);
              record[0].entrust_date = record[0].entrust_date != CommonUtil.formatNowDate() ? CommonUtil.formatDate(record[0].entrust_date) : "今天";
              record[0].entrust_time = CommonUtil.formatHourMinute(record[0].entrust_time);
              record[0].reason1Obj = CommonUtil.getReasonOption(record[0].reason1);
              record[0].reason2Obj = CommonUtil.getReasonOption(record[0].reason2);
              record[0].reason3Obj = CommonUtil.getReasonOption(record[0].reason3);
            }
            self.record = record;
          } else {
            self.record = [];
            self.error = response.data;
          }
          self.isLoading = false;

          //更新分享数据
          var data = {
            "record": self.record,
            "describe": self.error,
            "isLoading": self.isLoading
          };
          var shareGroup = LocalDAO.getShareGroup();
          shareGroup.transfer_data = data;
          LocalDAO.setShareGroup(shareGroup);
        });
      },
      /**
       * 跳转股票行情
       */
      toStock(){
        RemoteDAO.callStockLive(this.record[0].market_code + this.record[0].stock_code, "ordinary", "1", function () {
        });
      },
      toBuy(){
        this.$router.push({
          path: '/trade/buyin',
          query: {
            menuId: '1',
            stockCode: this.record[0].stock_code,
            marketCd: this.record[0].exchange_type,
            stockName: this.record[0].stock_name,
            followClient: this.clientId
          }
        })
      }
    }
  }
</script>

<style scoped>

</style>
